<template>
  <div class="page-container">
    <page_breadcrumb :getKeyMethod="init_table_model" @change="change_table_model" pageOption />
    <ex_super_table_page v-bind="option" ref="SuperTablePage" @selection-change="e => (selection = e)">
    </ex_super_table_page>

    <ex_super_dialog_form ref="handleDialogRef" v-bind="handleDialogOption" @afterSubmitSuccess="reload" />
  </div>
</template>
<script>
import superTablePageFunction from '@/mixin/super-table-page-function'
import emitOnFunction from '@/mixin/emit-on-function'

import page_table_model_manage from '@/mixin/page_table_model_manage'
let emitKey = 'returngood>product_config'
export default {
  title: 'label_return_goods_product_config',
  mixins: [superTablePageFunction, emitOnFunction(emitKey), page_table_model_manage],
  components: {},
  data() {
    return {
      selection: [],
      option: {
        search: {
          model: [
            { label: 'label_return_type', key: 'returnOrderType' },
            { label: 'label_platform', key: 'platformCodes', type: "select", url: '/open-api/open/OpenPlatformRpc/selectSimple.json', option: e => ({ label: e.platformName, value: e.platformCode }), },
            {
              label: 'label_warehouse',
              key: 'warehouseIds',
              type: 'base_warehouse_select'
            }
          ]
        },
        actionExtra: [
          {
            label: 'label_return_goods_product_config_add',
            attrs: { type: 'primary' },
            click: () => {
              this.$refs.handleDialogRef.showNew({
                title: this.$t('label_return_goods_product_config_add'),
                params: {}
              })
            }
          }
        ],
        table: {
          url: '/oms-api/refund/ReturnAutoBindProductViewRpc/selectAll.json',
          model: this.init_table_model()
        }
      },
      handleDialogOption: {
        // customClass: 'dialog_mini',
        // detailUrl: this.$url['oms/ReturnOrderDetail'],
        submitUrl: '/oms-api/refund/ReturnAutoBindProductViewRpc/saveOrUpdate.json',
        detailDataHandle: (data) => {
          return data
        },
        submitDataHandle: data => {
          console.log(data)
          return data
        },
        form: {
          // itemClass: "form_item_default",
          // inputClass: "form_input_default",
          default: {},
          model: [
            {
              key: 'returnOrderType',
              label: 'label_return_type',
              type: 'select',
              class: 'wfll',
              enum: 'ReturnRetTypeEnum',
              on: {
                change: e => {
                  this.$refs.handleDialogRef.set('productId', '')
                  this.$refs.handleDialogRef.set('warehouseIds', [])
                  if (e !== 'PLATFORM') {
                    this.$refs.handleDialogRef.set('platformCodes', [])
                  }
                  this.queryCanSelect()
                }
              }
            },
            {
              key: 'platformCodes',
              label: 'label_platform',
              type: 'checkbox-group',
              class: 'wfll',
              url: '/open-api/open/OpenPlatformRpc/selectSimple.json',
              if: e => e.returnOrderType === 'PLATFORM',
              option: e => ({ label: e.platformName, value: e.platformCode }),
              on: {
                change: e => {
                  this.$refs.handleDialogRef.set('productId', '')
                  this.$refs.handleDialogRef.set('warehouseIds', [])
                  this.queryCanSelect()
                }
              }
            },
            {
              key: 'warehouseIds',
              label: 'label_warehouse',
              class: 'wfll',
              // url: '/oms-api/refund/ReturnAutoBindProductViewRpc/queryCanSelect.json',
              type: 'select',
              render: (h, { data }) => {
                return (
                  <ex_super_input
                    attrs={{class:"wfll"}}
                    type="select"
                    value={data.warehouseIds}
                    multiple={true}
                    items={this.warehouseList}
                    option={e => ({
                      label: `${e.name}[${e.code}]`,
                      value: e.id
                    })}
                    onChange={e => {
                      this.$set(data, 'productId', '')
                      this.$set(data, 'warehouseIds', e)
                      this.queryCanSelect('productList')
                    }}
                  />
                )
              }
            },
            {
              key: 'productId',
              label: 'label_return_goods_product',
              class: 'wfll',
              render: (h, { data }) => {
                return (
                  <ex_super_input
                    attrs={{class:"wfll"}}
                    type="select"
                    value={data.productId}
                    items={this.productList}
                    option={e => ({
                      label: `${e.productName}[${e.productCode}]`,
                      value: e.id
                    })}
                    onChangeItem={e => {
                      this.$set(data, 'productId', e.id)
                      this.$set(data, 'productCode', e.productCode)
                      this.$set(data, 'productName', e.productName)
                    }}
                  />
                )
              }
            }
          ],
          rules: {
            returnOrderType: [
              {
                required: true,
                message: this.$t('tip_can_no_empty'),
                trigger: 'blur'
              }
            ],
            platformCodes: [
              {
                required: true,
                type: 'array',
                message: this.$t('tip_can_no_empty'),
                trigger: 'change'
              }
            ],
            warehouseIds: [
              {
                required: true,
                message: this.$t('tip_can_no_empty'),
                trigger: 'blur'
              }
            ],
            productId: [
              {
                required: true,
                message: this.$t('tip_can_no_empty'),
                trigger: 'blur'
              }
            ]
          }
        }
      },
      warehouseList: [],
      productList: []
    }
  },
  methods: {
    option_table_model() {
      return [
        { type: 'selection', clickToggle: true, keyGroup: 'label_table_operate' },
        { key: 'returnOrderType', label: 'label_return_type', 'show-overflow-tooltip': true, formatter: (r, c, v, i) => this.$enumShow(v, "ReturnRetTypeEnum") },
        {
          key: 'warehouseList',
          label: 'label_warehouse',
          'show-overflow-tooltip': true,
          formatter: (r, c, v, i) => {
            return v.map(it => it.warehouseName).join(',')
          }
        },
        {
          key: 'platformList', label: 'label_platform', 'show-overflow-tooltip': true,
          formatter: (r, c, v, i) => {
            return v.map(it => it.platformName).join(',')
          }
        },
        {
          key: 'gmtCreate',
          label: 'label_create_time',
          width: 140,
          formatter: (r, c, v, i) => this.$dateFormat(v)
        },
        {
          type: 'operate',
          width: 160,
          operate: [
            {
              label: 'label_edit',
              click: row => {
                this.queryCanSelect('warehouseList', row)
                this.queryCanSelect('productList', row)
                this.$refs.handleDialogRef.showNew({
                  title: this.$t('label_return_goods_product_config_edit'),
                  data: row
                })
              }
            },
            {
              label: 'label_delete',
              type: 'confirm-button',
              url: '/oms-api/refund/ReturnAutoBindProductViewRpc/remove.json',
              message: 'text_confirm_sure_operate',
              buttonClass: 'button_text_danger',
              confirmButtonType: 'success',
              urlType: 'form',
              params: row => {
                return { id: row.id }
              },
              done: ['tip', 'reload']
            }
          ]
        }
      ]
    },
    queryCanSelect(key, data) {
      data = data || this.$refs.handleDialogRef.getFormData()
      this.$ajax({
        url: '/oms-api/refund/ReturnAutoBindProductViewRpc/queryCanSelect.json',
        type: 'json',
        data: {
          returnOrderType: data.returnOrderType,
          platformCodes: data.platformCodes,
          warehouseIds: key === 'productList' ? data.warehouseIds : []
        },
        success: res => {
          if (key === 'productList') {
            this.productList = res.data.canSelectProduct
          } else {
            this.warehouseList = res.data.canSelectWarehouse
          }

        }
      })
    }
  }
}
</script>
<style></style>
